// 首页对应js
$(function () {
    // alert(1);
    // console.log(location.hash);

    // 监听hash变化的事件: onhashchange
    window.onhashchange = hashChange;

    // 页面初始,执行一次
    hashChange();

    // 监听hash变化功能
    function hashChange() {
        // 动态获取hash值
        let hash = location.hash;
        // console.log(hash);

        // 判断hash值
        // 一级路由
        switch (hash) {
            case '#home':
                $('.main').load('./page/home.html');
                break;

            case '#invest':
                $('.main').load('./page/invest.html');
                break;

            case '#borrow':
                $('.main').load('./page/borrow.html');
                break;

            case '#personal':
                $('.main').load('./page/personal.html');
                break;

                // 二级路由
                case '#personal/info':  // 账户信息
                    loadPersonalPage("info");
                    break;

                case '#personal/update':  // 账户信息修改
                    loadPersonalPage("update");
                    break;
                
                case '#personal/auth':  // 实名认证
                    loadPersonalPage("auth");
                    break;

                case '#personal/card':  // 银行卡管理
                    loadPersonalPage("card");
                    break;

                case '#personal/recharge':  // 充值中心
                    loadPersonalPage("recharge");
                    break;

                case '#personal/sub_borrow':  // 我要借款
                    loadPersonalPage("sub_borrow");
                    break;

                case '#personal/borrow_list':  // 我要借款
                    loadPersonalPage("borrow_list");
                    break;
            
            case '#404':
                $('.main').load('./page/404.html');
                break;
                
            default:
                $('.main').load('./page/home.html');
                break;
        }

        // 二级路由封装功能
        function loadPersonalPage(address) {
            $('.main').load('./page/personal.html', function () {
                $('#rightbox').load(`./page/personal/${address}.html`)
            });
        }



        // 切换主导航navbar-nav

        // let res = $(`.navbar-nav .nav-item a[href="${hash}"]`);
        // console.log(res);
        // res.closest('li').addClass('active').siblings().removeClass('active');

        /* if (hash=='') {
            $('.navbar-nav li:first a').closest('li').addClass('active').siblings().removeClass('active');
        } else {
            // res.closest('li').addClass('active').siblings().removeClass('active');

            // console.log(hash.includes('/'));  // 有/表示二级路由,没有/为一级路由

            if (!hash.includes('/')) {  // 一级路由
                $(`.navbar-nav .nav-item a[href="${hash}"]`).closest('li').addClass('active').siblings().removeClass('active');
            } else {  // 二级路由
                // console.log(hash.split('/')[0]);
                $(`.navbar-nav .nav-item a[href="${hash.split('/')[0]}"]`).closest('li').addClass('active').siblings().removeClass('active');
            }
        } */

        // 优化代码区:一
        // 定义变量保存变化数据
        /* let $changeCode;
        if (hash=='') {
            $changeCode = $('.navbar-nav li:first a');
        } else {
            if (!hash.includes('/')) { //取反:表示一级路由
                $changeCode = $(`.navbar-nav .nav-item a[href="${hash}"]`);
            } else {
                $changeCode = $(`.navbar-nav .nav-item a[href="${hash.split('/')[0]}"]`);
            }
        }
        $changeCode.closest('li').addClass('active').siblings().removeClass('active'); */

        // 优化代码区:二
        // 三元表达式
        let $changeCode = !hash ? $('.navbar-nav li:first a') : !hash.includes('/') ? $(`.navbar-nav .nav-item a[href="${hash}"]`) : $(`.navbar-nav .nav-item a[href="${hash.split('/')[0]}"]`);

        $changeCode.closest('li').addClass('active').siblings().removeClass('active');
    }


    // 用户登录成功后首页渲染'用户昵称'  '注销'
    // 获取本地存储用户昵称
    let userNickname = localStorage.getItem('data');
    // console.log(userNickname);
    
    // 判断 本地存储是否有获取到用户昵称
    if (userNickname == null) {
        // 本地没有用户昵称
        $('.login').html(`<a class="nav-item nav-link color" href="./login.html">登录</a>`);
        $('.register').html(`<a class="nav-item nav-link color" href="./register.html">注册</a>`);

    } else {
        // 本地有用户昵称
        $('.login').html(`<a class="nav-item nav-link color" href="#">${userNickname}</a>`);
        $('.register').html(`<a class="nav-item nav-link color" href="#" id="logout">注销</a>`);
    }

    // 注销功能
    $('#logout').click(function () {
        // alert('121212');
        
        localStorage.removeItem('data');
        localStorage.removeItem('startTime');
        sessionStorage.removeItem('id');
        location.href = '/';
    })

    // 设定时间节点(10s)后自动注销
    // 用户登录时在本地存储获取当前登录时间,设定固定时间节点(10s),用户登录后在线时长超过固定时间节点的当前时间currentTime注销
    // 开启计时器
    let timer = setInterval(function () {
        // 获取本地存储中用户登录时设定的结束时间点(+10s)
        let endTime = localStorage.getItem('startTime');
        // 获取计算机当前时间
        let currentTime = new Date().getTime();
        // console.log(endTime, currentTime);

        // 判断:  计算机当前时间节点>用户登录时设定注销的时间节点时,注销,关闭计时器
        if (currentTime >= endTime) {
            // 关闭计时器
            clearInterval(timer);
            // alert('登录时间超时!')
            // 自动注销: 清除本地数据
            localStorage.removeItem('data');
            localStorage.removeItem('startTime');
            sessionStorage.removeItem('id');
            // 自动注销: 页面渲染
            $('.login').html(`<a class="nav-item nav-link color" href="./login.html">登录</a>`);
            $('.register').html(`<a class="nav-item nav-link color" href="./register.html">注册</a>`);
        }
        
    },1000)





})